<template>
  <div>
    <a href="javascript:;" style="color:#409EFF;" @click="dialogVisibleIframe = true" v-html="paramsData.showHtml"></a>
    <el-dialog
      :title="titleText"
      :fullscreen="false"
      :visible.sync="dialogVisibleIframe"
      :width="paramsData.width"
      top="30px"
      >
      <div :style="'width:100%;height:'+paramsData.bodyHeight+'px;'">
        <iframe width='100%' height='100%' :src="actionUrl" frameborder="0"></iframe>
      </div>
    </el-dialog>
  </div>
</template>
<script>
define(['vue'],function(vue){
  return vue.component('comp-iframe-dialog',{
    template: template,
    props : {
      action :{required:true},
      row:{required:true},
      index:{required:true},
      params:{required:false},
      getParams:{required:false},
      showHtml:''
    },
    data:function(){
      return {
        dialogVisibleIframe:false,
        titleText:'查看明细',
        actionUrl:this.action,
        paramsData:{}
      };
    },
    mounted : function() {
      // console.log(this.params);
      this.paramsData.showHtml = this.row[this.params.showFiled];
      this.paramsData.width = this.params.width || "90%";

      this.paramsData.bodyHeight = document.documentElement.clientHeight || document.body.clientHeight;
      this.paramsData.bodyHeight -= 150;

      //处理弹框的url
      for(var k in this.getParams){
        var p = this.getParams[k];
        this.actionUrl += "&"+p+"="+this.row[p];
      }
    }
  });
});

</script>
<style type="text/css">
  .el-dialog__body{padding: 10px 15px;}
</style>